import React, { useState } from "react";

import { Row, Col } from 'antd';


import UploadBox from './Upload';


export default function UploadGroup({ num = 1, span, onChange }) {
    const [ url, setImg ] = useState([]);

    let onChangeUrl = (k, v) => {
        url[k] = v;
        setImg([ ...url ]);
        onChange(url);
    };

    let uploads = [];
    for (let i = 0; i < num; i++) {
        uploads.push(
            <Col span={span} key={i}>
                <UploadBox
                    action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
                    onChangeFile={url => onChangeUrl(i, url)}
                >
                </UploadBox>
            </Col>
        );
    }

    return (
        <Row gutter={10}>
            { uploads }
        </Row>
    );
}